<template>
    <div>
        <h1>构信息管理添加</h1>
        <table class="table">
            <tbody>
                <tr>
                    <td><span style="color: red;">*</span>机构名称</td>
                    <td>
                        <input type="text" v-model="data.name">
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>特色服务</td>
                    <td>
                        <select v-model="data.messagerTypes">
                            <option value="">==请选择==</option>
                            <option v-for="b in bin" :value="b.messagerTypes">{{ b.messagerTypes }}</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>手机号</td>
                    <td>
                        <input type="text" v-model="data.phone">
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>地址</td>
                    <td>
                        <textarea v-model="data.addres">

                        </textarea>
                    </td>
                </tr>
                <tr>
                    <td>分享</td>
                    <td>
                        <input type="text" v-model="data.fenX">
                    </td>
                </tr>
                <tr>
                    <td>收藏</td>
                    <td>
                        <input type="text" v-model="data.num">
                    </td>
                </tr>
                <tr>
                    <td>状态</td>
                    <td>
                        <input type="radio" value="true" name="type" v-model="data.type">已发布
                        <input type="radio" value="false" name="type" v-model="data.type">未发布
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>详情</td>
                    <td>
                        <input type="text" v-model="data.people">
                    </td>
                </tr>
                <tr>
                    <td>更新时间</td>
                    <td>
                        <input type="date" v-model="data.times">
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>图片</td>
                    <td>
                       <input type="file" @change="Upload">
                       <img :src="'https://localhost:7067'+data.img" width="90px" height="90px" >
                    </td>
                </tr>
                <tr>
                    <td><span style="color: red;">*</span>导出</td>
                    <td>
                       <input type="file" @change="Up">
                      
                    </td>
                </tr>
                <tr>
                    <td></td>
                    <td>
                        <input type="button" value="添加" @click="Add">
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script setup lang="ts">

import axios from 'axios';
import { ref } from 'vue';
import { onMounted } from 'vue';
import { useRouter } from 'vue-router';

const router=useRouter();
onMounted(()=>{
    Bind();
})

const data=ref({
  "id": 0,
  "name": "",
  "messagerTypes": "",
  "fenX": 0,
  "num": 0,
  "type": true,
  "people": "",
  "times": "2025-03-19T03:44:36.603Z",
  "img": "",
  "addres": "",
  "phone": "",
  "isid": false
})

const bin=ref([{
      "messgerId": 0,
    "messagerTypes": "24h监护"
}])

//导出
const Up=(c:any)=>{
    console.log(c.target.files[0].type);
}

//图片上传
const Upload=(a:any)=>{
    var f=a.target.files[0];
    var fd=new FormData();
    fd.append("file",f);
    axios.post("https://localhost:7067/api/Up",fd).then(res=>{
        data.value.img=res.data;
    })
}

//绑定下拉框
const Bind=()=>{
    axios.get("https://localhost:7067/api/IMessagerType/Bind").then(res=>{
        bin.value=res.data;
    })
}

//添加
const Add=()=>{
    axios.post("https://localhost:7067/api/Messager/Add",data.value).then(res=>{
        if(res.data>0){
            alert('添加成功');
            router.push({path:"/Show"});
        }else{
            alert('添加失败');
        }
    })
}

</script>

<style scoped>

</style>